<!DOCTYPE html>
<html lang="en" dir=ZgotmplZ>

<head>
  <script async defer src="https://buttons.github.io/buttons.js"></script>
  <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Typed data object">
<meta name="theme-color" content="#FFFFFF"><meta property="og:title" content="furo-data-object" />
<meta property="og:description" content="Typed data object" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://web-components.furo.pro/docs/modules/furo-data/furo-data-object/" /><meta property="article:section" content="docs" />

<meta property="article:modified_time" content="2023-05-15T11:08:04+02:00" />
<title>furo-data-object | フロー Furo Web</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.9cf05710651e8f9a974123fc1a656fbb5eb2f912dba4c022b69792d2f93e1c40.css" integrity="sha256-nPBXEGUej5qXQSP8GmVvu16y&#43;RLbpMAitpeS0vk&#43;HEA=">
<script defer src="/en.search.min.b0bf84841deec51ff6f5057e68d3262d4265b55605be890ebf7c38b97b2fe329.js" integrity="sha256-sL&#43;EhB3uxR/29QV&#43;aNMmLUJltVYFvokOv3w4uXsv4yk="></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->

  

  <link href="/main.css" rel="stylesheet"/>
</head>

<body dir=ZgotmplZ>
<fixed-tooltip-display></fixed-tooltip-display>
  <input type="checkbox" class="hidden toggle" id="menu-control" />
  <input type="checkbox" class="hidden toggle" id="toc-control" />
  <div ></div>
  <main class="container flex">
    <aside class="book-menu">
      
  <nav>
<h2 class="book-brand">
  <a href="/"><span>フロー Furo Web</span>
  </a>
</h2>


<div class="book-search">
  <input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
  <div class="book-search-spinner hidden"></div>
  <ul id="book-search-results"></ul>
</div>











  



  
  <ul>
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-64d0ac0e8a385a6091d238dd382da7cf" class="toggle"  />
    <label for="section-64d0ac0e8a385a6091d238dd382da7cf" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/guides/" class="">Guides</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/dealing-w-data/" class="">Dealing with data</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-48dba13e1258b1e2cf129032b0d1fc3e" class="toggle"  />
    <label for="section-48dba13e1258b1e2cf129032b0d1fc3e" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/guides/routing/" class="">Routing</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/routing/subrouting/" class="">Sub routing</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/app-flow/" class="">Application Flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/FNA/" class="">Extending a UI lib</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/type-renderer/" class="">Type Renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/featuretoggle/" class="">Feature Toggles</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-c131070b1e715f28624af5fdfd93165a" class="toggle" checked />
    <label for="section-c131070b1e715f28624af5fdfd93165a" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/" class="">Packages</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-cca842a4d0376120bfbf8e2c08c07ff4" class="toggle" checked />
    <label for="section-cca842a4d0376120bfbf8e2c08c07ff4" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-data/" class="">@furo/data</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-api-fetch/" class="">furo-api-fetch</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-collection-agent/" class="">furo-collection-agent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-custom-method/" class="">furo-custom-method</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-flow-repeat/" class="">furo-data-flow-repeat</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-hide-content/" class="">furo-data-hide-content</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-object/" class=" active">furo-data-object</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-deep-link/" class="">furo-deep-link</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-entity-agent/" class="">furo-entity-agent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-entity-field/" class="">furo-entity-field</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-hateoas-state/" class="">furo-hateoas-state</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-message-container-handler/" class="">furo-message-container-handler</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-rel-exists/" class="">furo-rel-exists</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-reverse-deep-link/" class="">furo-reverse-deep-link</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-type-renderer/" class="">furo-type-renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/AgentHelper/" class="">AgentHelper</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/DataObject/" class="">DataObject</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/FieldNode/" class="">FieldNode</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/FieldNodeAdapter/" class="">FieldNodeAdapter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/RepeaterNode/" class="">RepeaterNode</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ScalarTypeHelper/" class="">ScalarTypeHelper</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorDefaultTypes/" class="">ValidatorDefaultTypes</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorFuroBigDecimal/" class="">ValidatorFuroBigDecimal</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorFuroReference/" class="">ValidatorFuroReference</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufBoolValue/" class="">ValidatorGoogleProtobufBoolValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufFloatValue/" class="">ValidatorGoogleProtobufFloatValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufInt64Value/" class="">ValidatorGoogleProtobufInt64Value</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleTypeDate/" class="">ValidatorGoogleTypeDate</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleTypeMoney/" class="">ValidatorGoogleTypeMoney</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorNumericTypes/" class="">ValidatorNumericTypes</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-021db3e6cecc4cb464638d9452766952" class="toggle"  />
    <label for="section-021db3e6cecc4cb464638d9452766952" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-fbp/" class="">@furo/fbp</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/empty-fbp-node/" class="">empty-fbp-node</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/flow-bind/" class="">flow-bind</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/flow-repeat/" class="">flow-repeat</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/DOMFBP/" class="">DOMFBP</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/FBP/" class="">FBP</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/FbpBreakpoints/" class="">FbpBreakpoints</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-3e40020dcb75400959dcadfc7e247453" class="toggle"  />
    <label for="section-3e40020dcb75400959dcadfc7e247453" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-framework/" class="">@furo/framework</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/BaseSpecValidators/" class="">BaseSpecValidators</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/Env/" class="">Env</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/FuroFeatureToggle/" class="">FuroFeatureToggle</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/i18n/" class="">i18n</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/Init/" class="">Init</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/KeyState/" class="">KeyState</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/NodeEvent/" class="">NodeEvent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroBigDecimal/" class="">ValidatorFuroBigDecimal</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroFatNumeric/" class="">ValidatorFuroFatNumeric</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroFatString/" class="">ValidatorFuroFatString</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroReference/" class="">ValidatorFuroReference</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufBoolValue/" class="">ValidatorGoogleProtobufBoolValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufFloatValue/" class="">ValidatorGoogleProtobufFloatValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufInt64Value/" class="">ValidatorGoogleProtobufInt64Value</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufTimestamp/" class="">ValidatorGoogleProtobufTimestamp</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleTypeDate/" class="">ValidatorGoogleTypeDate</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleTypeMoney/" class="">ValidatorGoogleTypeMoney</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorRegistry/" class="">ValidatorRegistry</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-71921f8b00ba9f1d7ea65557f9a4892b" class="toggle"  />
    <label for="section-71921f8b00ba9f1d7ea65557f9a4892b" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-layout/" class="">@furo/layout</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-backdrop/" class="">furo-backdrop</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-backdrop-display/" class="">furo-backdrop-display</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-empty-spacer/" class="">furo-empty-spacer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-form-layouter/" class="">furo-form-layouter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-horizontal-flex/" class="">furo-horizontal-flex</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-resizer/" class="">furo-resizer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-split-view/" class="">furo-split-view</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-vertical-flex/" class="">furo-vertical-flex</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-vertical-scroller/" class="">furo-vertical-scroller</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-d417ac8cb7a1ccb4381e8ddf1c7562a0" class="toggle"  />
    <label for="section-d417ac8cb7a1ccb4381e8ddf1c7562a0" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-route/" class="">@furo/route</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-app-flow/" class="">furo-app-flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-app-flow-router/" class="">furo-app-flow-router</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-document-title/" class="">furo-document-title</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-location/" class="">furo-location</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-location-updater/" class="">furo-location-updater</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-lock-navigation/" class="">furo-lock-navigation</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-pages/" class="">furo-pages</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-panel-coordinator/" class="">furo-panel-coordinator</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/BasePanel/" class="">BasePanel</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/panelRegistry/" class="">panelRegistry</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-97a0e3b8ee9f906213df62a54586924e" class="toggle"  />
    <label for="section-97a0e3b8ee9f906213df62a54586924e" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-util/" class="">@furo/util</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-config/" class="">furo-config</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-config-loader/" class="">furo-config-loader</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-de-bounce/" class="">furo-de-bounce</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-demo-snippet/" class="">furo-demo-snippet</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-feature-toggle/" class="">furo-feature-toggle</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-fetch-json/" class="">furo-fetch-json</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-forth-stack/" class="">furo-forth-stack</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-get-clipboard/" class="">furo-get-clipboard</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-graph-renderer/" class="">furo-graph-renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-head-tail/" class="">furo-head-tail</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-hp-35/" class="">furo-hp-35</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-interval-pulse/" class="">furo-interval-pulse</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-key-filter/" class="">furo-key-filter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-keydown/" class="">furo-keydown</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-markdown/" class="">furo-markdown</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-navigation-pad/" class="">furo-navigation-pad</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-pretty-json/" class="">furo-pretty-json</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-put-clipboard/" class="">furo-put-clipboard</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-show-flow/" class="">furo-show-flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/light-bulb/" class="">light-bulb</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/Config/" class="">Config</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/ConfigTree/" class="">ConfigTree</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/EmptyStackError/" class="">EmptyStackError</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-e8b2e199854a11484105b91a892831fe" class="toggle"  />
    <label for="section-e8b2e199854a11484105b91a892831fe" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-webtypes/" class="">@furo/web-types</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
  </ul>

        </li>
      
    
  </ul>

        </li>
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
  </ul>











  
<ul>
  
  <li>
    <a href="https://ui5.furo.pro" target="_blank" rel="noopener">
        SAP UI5 Integration
      </a>
  </li>
  
  <li>
    <a href="https://furo.pro" target="_blank" rel="noopener">
        フロー Furo
      </a>
  </li>
  
</ul>






</nav>




  <script>(function(){var e=document.querySelector("aside.book-menu nav");addEventListener("beforeunload",function(){localStorage.setItem("menu.scrollTop",e.scrollTop)}),e.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>


 
    </aside>

    <div class="book-page">
      <header class="book-header">
        
  <div class="flex align-center justify-between">
  <label for="menu-control">
    <img src="/svg/menu.svg" class="book-icon" alt="Menu" />
  </label>

  <strong>furo-data-object</strong>

  <label for="toc-control">
    
    <img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
    
  </label>
</div>


  
  <aside class="hidden clearfix">
    
  <nav id="TableOfContents">
  <ul>
    <li><a href="#attributes-and-properties">Attributes and Properties</a>
      <ul>
        <li><a href="#type"><strong>type</strong></a></li>
        <li><a href="#json"><strong>json</strong></a></li>
      </ul>
    </li>
    <li><a href="#events">Events</a>
      <ul>
        <li><a href="#data-injected"><strong>data-injected</strong></a></li>
        <li><a href="#data-changed"><strong>data-changed</strong></a></li>
        <li><a href="#data-changed-after-inject"><strong>data-changed-after-inject</strong></a></li>
        <li><a href="#field-value-changed"><strong>field-value-changed</strong></a></li>
        <li><a href="#validation-success"><strong>validation-success</strong></a></li>
        <li><a href="#validation-failed"><strong>validation-failed</strong></a></li>
        <li><a href="#data-object-became-invalid"><strong>data-object-became-invalid</strong></a></li>
        <li><a href="#data-object-became-valid"><strong>data-object-became-valid</strong></a></li>
        <li><a href="#object-ready"><strong>object-ready</strong></a></li>
        <li><a href="#init-completed"><strong>init-completed</strong></a></li>
      </ul>
    </li>
    <li><a href="#methods">Methods</a>
      <ul>
        <li><a href="#injectraw"><strong>injectRaw</strong></a></li>
        <li><a href="#setpristine"><strong>setPristine</strong></a></li>
        <li><a href="#clearallerrors"><strong>clearAllErrors</strong></a></li>
        <li><a href="#validateallfields"><strong>validateAllFields</strong></a></li>
        <li><a href="#appenderrors"><strong>appendErrors</strong></a></li>
        <li><a href="#reset"><strong>reset</strong></a></li>
        <li><a href="#init"><strong>init</strong></a></li>
        <li><a href="#getdata"><strong>getData</strong></a></li>
      </ul>
    </li>
  </ul>
</nav>


  </aside>
  
 
      </header>

      
      
  <article class="markdown"><h1 id="furo-data-object">
  furo-data-object
  <a class="anchor" href="#furo-data-object">#</a>
</h1>
<p><strong>@furo/data</strong> <small>v2.18.0</small>
<br><code>import '@furo/data/src/furo-data-object.js';</code><small>
<br>exports <em>FuroDataObject</em> js
<br>exports <code>&lt;furo-data-object&gt;</code> custom-element-definition
<br>superclass <em>LitElement</em></small>
<br><small>summary <em>Typed data object</em></small></p>
<p><code>furo-data-object</code> gives you a object which is built based on the <strong>type</strong> spec.
The types must be available in the {Env}, learn more about setting up the environment in the guide.</p>
<p>The data will mostly be used in a [data-ui]/(../../data-input/doc) component or in component that yoh build, which contains one or more of them.</p>
<p><code>furo-data-object</code> receives its data regularly from a 
  <a href="/docs/modules/furo-data/furo-collection-agent/">collection-aget</a> or a  
  <a href="/docs/modules/furo-data/furo-entity-agent/">entity-aget</a>.
But you can also send json data which is formed like the raw-data of this type.</p>
<p><code>furo-data-object</code> will not do any validation or data manipulation neither will send the data. It is just responsible to
transform incomming data to an object and vice versa. You can access the manipulated data structure on the property
<code>.data.rawData</code> with javascript (if needed).</p>
<div class="highlight"><div style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">
<table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 1
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 2
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 3
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 4
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 5
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 6
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 7
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 8
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 9
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">10
</span></code></pre></td>
<td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span> <span style="color:#998;font-style:italic">&lt;!-- The furo-data-object will send a initial dataObject of type project.Project on at-response-ready --&gt;</span>
</span></span><span style="display:flex;"><span> &lt;<span style="color:#000080">furo-data-object</span>
</span></span><span style="display:flex;"><span>     <span style="color:#008080">type</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;project.Project&#34;</span>
</span></span><span style="display:flex;"><span>     <span style="color:#008080">fn-inject-raw</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--response(*.data)&#34;</span> <span style="color:#008080">at-object-ready</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--dataObject&#34;</span>&gt;&lt;/<span style="color:#000080">furo-data-object</span>&gt;
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span> <span style="color:#998;font-style:italic">&lt;!-- The furo-entity-agent will fetch the data from ProjectService and pass it in at-response to the furo-data-object.  --&gt;</span>
</span></span><span style="display:flex;"><span> &lt;<span style="color:#000080">furo-entity-agent</span>
</span></span><span style="display:flex;"><span>     <span style="color:#008080">service</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;ProjectService&#34;</span>
</span></span><span style="display:flex;"><span>     <span style="color:#008080">fn-save</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--saveClicked&#34;</span>
</span></span><span style="display:flex;"><span>     <span style="color:#008080">fn-bind-request-data</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--dataObject&#34;</span> <span style="color:#008080">at-response</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--response&#34;</span> &gt;&lt;/<span style="color:#000080">furo-entity-agent</span>&gt;
</span></span></code></pre></td></tr></table>
</div>
</div><h2 id="attributes-and-properties">
  Attributes and Properties
  <a class="anchor" href="#attributes-and-properties">#</a>
</h2>
<h3 id="type">
  <strong>type</strong>
  <a class="anchor" href="#type">#</a>
</h3>
<p><span  style="border-width:2px; border-style: solid;border-color:  rgb(255, 182, 91);font-family:monospace; padding:2px 4px;">type</span>
<small><code>String</code> </small></p>
<p>Set the type. The type must be available in the environment
<br><br></p>
<h3 id="json">
  <strong>json</strong>
  <a class="anchor" href="#json">#</a>
</h3>
</small>
<p>get the data from the data object as raw json
<br><br></p>
<h2 id="events">
  Events
  <a class="anchor" href="#events">#</a>
</h2>
<h3 id="data-injected">
  <strong>data-injected</strong>
  <a class="anchor" href="#data-injected">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-data-injected</span>
→ <small>``</small></p>
<p>Fired when injected data was processed (<strong>bubbles</strong>).
<br><br></p>
<h3 id="data-changed">
  <strong>data-changed</strong>
  <a class="anchor" href="#data-changed">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-data-changed</span>
→ <small><code>{Object|CollectionNode}</code></small></p>
<p>Fired when data in furo-data-object has changed  (<strong>bubbles</strong>). This event fires a lot, consider using a de-bounce with the event.
<br><br></p>
<h3 id="data-changed-after-inject">
  <strong>data-changed-after-inject</strong>
  <a class="anchor" href="#data-changed-after-inject">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-data-changed-after-inject</span>
→ <small><code>{Object|CollectionNode}</code></small></p>
<p>Fired when data in furo-data-object has changed after injectRaw is complete (<strong>bubbles</strong>). This event fires a lot, consider using a de-bounce with the event.
<br><br></p>
<h3 id="field-value-changed">
  <strong>field-value-changed</strong>
  <a class="anchor" href="#field-value-changed">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-field-value-changed</span>
→ <small><code>{Object} the field node</code></small></p>
<p>Fired when a field has changed.
<br><br></p>
<h3 id="validation-success">
  <strong>validation-success</strong>
  <a class="anchor" href="#validation-success">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-validation-success</span>
→ <small><code>DataObject</code></small></p>
<p>Fired when validation results in a valid state.
<br><br></p>
<h3 id="validation-failed">
  <strong>validation-failed</strong>
  <a class="anchor" href="#validation-failed">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-validation-failed</span>
→ <small><code>DataObject</code></small></p>
<p>Fired when validation results in a invalid state.
<br><br></p>
<h3 id="data-object-became-invalid">
  <strong>data-object-became-invalid</strong>
  <a class="anchor" href="#data-object-became-invalid">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-data-object-became-invalid</span>
→ <small><code>{Object|EntityNode} reference to entity</code></small></p>
<p>Fired when the data object switches from ininvalid to invalid state (<strong>bubbles</strong>).
<br><br></p>
<h3 id="data-object-became-valid">
  <strong>data-object-became-valid</strong>
  <a class="anchor" href="#data-object-became-valid">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-data-object-became-valid</span>
→ <small><code>{Object|EntityNode} reference to entity</code></small></p>
<p>Fired when the data object switches from invalid to valid state (<strong>bubbles</strong>).
<br><br></p>
<h3 id="object-ready">
  <strong>object-ready</strong>
  <a class="anchor" href="#object-ready">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-object-ready</span>
→ <small><code>A EntityNode object</code></small></p>
<p>Fired when the object defined by <code>type</code> is built (<strong>bubbles</strong>).
<br><br></p>
<h3 id="init-completed">
  <strong>init-completed</strong>
  <a class="anchor" href="#init-completed">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-init-completed</span>
→ <small><code>A EntityNode object</code></small></p>
<p>Fired when the object init was done (<strong>bubbles</strong>).
<br><br></p>
<h2 id="methods">
  Methods
  <a class="anchor" href="#methods">#</a>
</h2>
<h3 id="injectraw">
  <strong>injectRaw</strong>
  <a class="anchor" href="#injectraw">#</a>
</h3>
<p><small><strong>injectRaw</strong>(<em>jsonObj</em> `` ) ⟹ <code>void</code></small></p>
<p><small>`` </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-inject-raw</span></p>
<p>inject a raw data response from the corresonding agent.</p>
<p>Input may look something like this:</p>
<p><strong>Entity data</strong></p>
<div class="highlight"><div style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">
<table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">1
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">2
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">3
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">4
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">5
</span></code></pre></td>
<td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-json" data-lang="json"><span style="display:flex;"><span>{
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;data&#34;</span>: {},
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;links&#34;</span>: [],
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;meta&#34;</span>: {}
</span></span><span style="display:flex;"><span>}
</span></span></code></pre></td></tr></table>
</div>
</div><p><strong>Collection data</strong></p>
<div class="highlight"><div style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">
<table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">1
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">2
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">3
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">4
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">5
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">6
</span></code></pre></td>
<td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-json" data-lang="json"><span style="display:flex;"><span>{
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;data&#34;</span>: {},
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;links&#34;</span>: [],
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;meta&#34;</span>: {},
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;entities&#34;</span>: []
</span></span><span style="display:flex;"><span>}
</span></span></code></pre></td></tr></table>
</div>
</div><ul>
<li><small><em>jsonObj</em> </small>
<br><br></li>
</ul>
<h3 id="setpristine">
  <strong>setPristine</strong>
  <a class="anchor" href="#setpristine">#</a>
</h3>
<p><small><strong>setPristine</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-set-pristine</span></p>
<p>Set all nodes to pristine</p>
<p>Useful for working with deltas</p>
<p><br><br></p>
<h3 id="clearallerrors">
  <strong>clearAllErrors</strong>
  <a class="anchor" href="#clearallerrors">#</a>
</h3>
<p><small><strong>clearAllErrors</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-clear-all-errors</span></p>
<p>Clears all errors on children without any validation!</p>
<p><br><br></p>
<h3 id="validateallfields">
  <strong>validateAllFields</strong>
  <a class="anchor" href="#validateallfields">#</a>
</h3>
<p><small><strong>validateAllFields</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-validate-all-fields</span></p>
<p>Triggers the validation of all fields in the data object.</p>
<p>Use this before you submit some data to a server.</p>
<p>Will cause a <code>data-object-became-valid</code> or <code>data-object-became-invalid</code> and a validation-success or validation-failed event.</p>
<p><br><br></p>
<h3 id="appenderrors">
  <strong>appendErrors</strong>
  <a class="anchor" href="#appenderrors">#</a>
</h3>
<p><small><strong>appendErrors</strong>(<em>grpcStatus</em> `` ) ⟹ <code>void</code></small></p>
<p><small>`` </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-append-errors</span></p>
<p>Append errors from custom methods or other agents or sources to the data object.
The error object must have a grpc status error signature like:</p>
<div class="highlight"><div style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">
<table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 1
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 2
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 3
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 4
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 5
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 6
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 7
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 8
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f"> 9
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">10
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">11
</span></code></pre></td>
<td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-json" data-lang="json"><span style="display:flex;"><span>{
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;code&#34;</span>:<span style="color:#099">3</span>,
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;message&#34;</span>:<span style="color:#d14">&#34;invalid username&#34;</span>,
</span></span><span style="display:flex;"><span> <span style="color:#000080">&#34;details&#34;</span>:[{
</span></span><span style="display:flex;"><span>         <span style="color:#000080">&#34;@type&#34;</span>:<span style="color:#d14">&#34;type.googleapis.com/google.rpc.BadRequest&#34;</span>,
</span></span><span style="display:flex;"><span>         <span style="color:#000080">&#34;field_violations&#34;</span>:[{
</span></span><span style="display:flex;"><span>             <span style="color:#000080">&#34;field&#34;</span>:<span style="color:#d14">&#34;user.name&#34;</span>,
</span></span><span style="display:flex;"><span>             <span style="color:#000080">&#34;description&#34;</span>:<span style="color:#d14">&#34;The username must only contain alphanumeric characters&#34;</span>
</span></span><span style="display:flex;"><span>          }]
</span></span><span style="display:flex;"><span>    }]
</span></span><span style="display:flex;"><span>}
</span></span></code></pre></td></tr></table>
</div>
</div><ul>
<li><small><em>grpcStatus</em> </small>
<br><br></li>
</ul>
<h3 id="reset">
  <strong>reset</strong>
  <a class="anchor" href="#reset">#</a>
</h3>
<p><small><strong>reset</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-reset</span></p>
<p>Reset the model to the last injected state.</p>
<p>To set the model to the initial state use init</p>
<p><br><br></p>
<h3 id="init">
  <strong>init</strong>
  <a class="anchor" href="#init">#</a>
</h3>
<p><small><strong>init</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-init</span></p>
<p>Sets the model to an initial state according to the given type.</p>
<p>fires <em>init-completed</em></p>
<p>To reset changed data to the last injected state, please use reset();</p>
<p><br><br></p>
<h3 id="getdata">
  <strong>getData</strong>
  <a class="anchor" href="#getdata">#</a>
</h3>
<p><small><strong>getData</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-get-data</span></p>
<p>get the data of the data object</p>
<p><br><br></p>
</article>
 
      

      <footer class="book-footer">
        
  <div class="flex flex-wrap justify-between">



  <div><a class="flex align-center" href="https://github.com/theNorstroem/furo/documentation/commit/98f19d453453c76144147e187904f3bdac5a588f" title='Last modified by veith | May 15, 2023' target="_blank" rel="noopener">
      <img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
      <span>May 15, 2023</span>
    </a>
  </div>



</div>

 
        
      </footer>

      
  
  <div class="book-comments">

</div>
  
 

      <label for="menu-control" class="hidden book-menu-overlay"></label>
    </div>

    
    <aside class="book-toc">
      
  <nav id="TableOfContents">
  <ul>
    <li><a href="#attributes-and-properties">Attributes and Properties</a>
      <ul>
        <li><a href="#type"><strong>type</strong></a></li>
        <li><a href="#json"><strong>json</strong></a></li>
      </ul>
    </li>
    <li><a href="#events">Events</a>
      <ul>
        <li><a href="#data-injected"><strong>data-injected</strong></a></li>
        <li><a href="#data-changed"><strong>data-changed</strong></a></li>
        <li><a href="#data-changed-after-inject"><strong>data-changed-after-inject</strong></a></li>
        <li><a href="#field-value-changed"><strong>field-value-changed</strong></a></li>
        <li><a href="#validation-success"><strong>validation-success</strong></a></li>
        <li><a href="#validation-failed"><strong>validation-failed</strong></a></li>
        <li><a href="#data-object-became-invalid"><strong>data-object-became-invalid</strong></a></li>
        <li><a href="#data-object-became-valid"><strong>data-object-became-valid</strong></a></li>
        <li><a href="#object-ready"><strong>object-ready</strong></a></li>
        <li><a href="#init-completed"><strong>init-completed</strong></a></li>
      </ul>
    </li>
    <li><a href="#methods">Methods</a>
      <ul>
        <li><a href="#injectraw"><strong>injectRaw</strong></a></li>
        <li><a href="#setpristine"><strong>setPristine</strong></a></li>
        <li><a href="#clearallerrors"><strong>clearAllErrors</strong></a></li>
        <li><a href="#validateallfields"><strong>validateAllFields</strong></a></li>
        <li><a href="#appenderrors"><strong>appendErrors</strong></a></li>
        <li><a href="#reset"><strong>reset</strong></a></li>
        <li><a href="#init"><strong>init</strong></a></li>
        <li><a href="#getdata"><strong>getData</strong></a></li>
      </ul>
    </li>
  </ul>
</nav>

 
    </aside>
    
  </main>

  
</body>


<script type="module" src="https://cdn.jsdelivr.net/npm/@furo/precompiled@2.6.0/dist/doc-helper.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@furo/precompiled@2.6.0/dist/furo-fbp.js"></script>
</html>












